/**
 * Created by Jacky.Gao on 2017-10-23.
 */
import Instance from './Instance.js';
import Utils from '../Utils.js';
export default class DatetimeInstance extends Instance{
    constructor(){
        super();
        this.isDate=true;
        var seq=Utils.seq(DatetimeInstance.ID);
        var label="日期选择"+seq;
        this.element=this.newElement(label);
        this.dateFormat="yyyy-mm-dd";
        this.inputElement=$("<div>");
        this.element.append(this.inputElement);
        this.datePickerinputGroup=$("<div class='input-group date'>");
        this.inputElement.append(this.datePickerinputGroup);
        var text=$("<input type='text' class='form-control'>");
        this.datePickerinputGroup.append(text);
        var pickerIcon=$("<span class='input-group-addon'><span class='glyphicon glyphicon-calendar'></span></span>");
        this.datePickerinputGroup.append(pickerIcon);
        this.datePickerinputGroup.datetimepicker({
            format:this.dateFormat,
            autoclose:1,
            startView:2,
            minView:2
        });
        this.element.uniqueId();
        this.id=this.element.prop("id");
    }
    setDateFormat(format) {
        // 如果格式未改变或无效，则直接返回
        if (this.dateFormat === format || !format) {
            return;
        }

        // 更新日期格式
        this.dateFormat = format;

        // 移除旧的日期选择器实例
        this.datePickerinputGroup.datetimepicker('remove');

        // 配置选项的基础部分
        const options = {
            format: this.dateFormat,
            autoclose: 1 // 自动关闭日期选择器
        };

        // 根据不同的日期格式设置视图选项
        switch (this.dateFormat) {
            case 'yyyy':       // 日期格式：年
                options.startView = 3; // 初始视图为日期视图
                options.minView = 3;   // 最小视图为日期视图
                break;
            case 'yyyy-mm-dd': // 日期格式：年-月-日
            case 'yyyymm':     // 日期格式：年月
            case 'yyyymmdd':   // 日期格式：年月日
                options.startView = 2; // 初始视图为日期视图
                options.minView = 2;   // 最小视图为日期视图
                break;
            case 'yyyy-mm-dd hh:ii:ss': // 日期时间格式：年-月-日 时:分:秒
                options.startView = 2; // 初始视图为日期视图
                options.minView = 0;   // 最小视图为秒视图
                break;
            case 'hh:ii': // 时间格式：时:分
                options.startView = 0; // 初始视图为小时视图
                options.minView = 0;   // 最小视图为分钟视图
                options.minuteStep = 1;
                options.viewSelect = "hour"; // 选择单位为小时
                break;
            default:
                options.startView = 2; // 初始视图为日期视图
                options.minView = 2;   // 最小视图为日期视图
                break;
        }
        // 初始化新的日期选择器实例
        this.datePickerinputGroup.datetimepicker(options);
    }
    initFromJson(json){
        super.fromJson(json);
        this.setDateFormat(json.format);
        if(json.searchOperator){
            this.searchOperator=json.searchOperator;
        }
    }
    toJson(){
        return {
            label:this.label,
            labelPosition:this.labelPosition,
            bindParameter:this.bindParameter,
            format:this.dateFormat,
            type:DatetimeInstance.TYPE
        };
    }
    toXml(){
        let xml=`<input-datetime label="${this.label}" type="${DatetimeInstance.TYPE}" label-position="${this.labelPosition || 'top'}" bind-parameter="${this.bindParameter || ''}" format="${this.dateFormat}"></input-datetime>`;
        return xml;
    }
}
DatetimeInstance.TYPE="Datetime";
DatetimeInstance.ID="datetime_instance";